<template>
	<view class="wm">
		<view class="list">
			<uni-list :border="border">
				<!-- 头像 -->
				<uni-list-item  link :border="border" to="/subpkg/image_crop/image_crop">
					<template v-slot:body>
						<text class="text">点击头像设置</text>
					</template>
					<template v-slot:footer>
					   <image class="avater" :src="avatar ? avatar : '../../static/132.jpg'"></image>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
		<view class="list">
			<uni-list :border="border">
				<!-- 昵称 -->
				<uni-list-item link :border="border" to="/subpkg/user_nickname/user_nickname">
					<template v-slot:body>
						<text class="text">昵称</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.nickname ? userInfo.nickname : "未绑定"}}
						</view>
					</template>
				</uni-list-item>
				<!-- 身份证号 -->
				<uni-list-item link :border="border" to="/subpkg/update_user/update_user">
					<template v-slot:body >
						<text class="text">身份证号</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.idcard ? userInfo.idcard : "待完善" }}
						</view>
					</template>
				</uni-list-item>
				<!-- 手机号码 -->
				<uni-list-item link :border="border" to="/subpkg/update_phone/update_phone">
					<template v-slot:body>
						<text class="text">手机号码</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.phone ? userInfo.phone : "未绑定"}}
						</view>
					</template>
				</uni-list-item>
				<!-- 微信号 -->
				<uni-list-item link :border="border" to="/subpkg/user_wxnumber/user_wxnumber">
					<template v-slot:body>
						<text class="text">微信号</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.wxnumber ? userInfo.wxnumber : "未绑定"}}
						</view>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
		<view class="list">
			<uni-list :border="border">
				<!-- 姓名 -->
				<uni-list-item link :border="border" to="/subpkg/user_name/user_name">
					<template v-slot:body >
						<text class="text">真实姓名</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.name ? userInfo.name : "待完善" }}
						</view>
					</template>
				</uni-list-item>
				<!-- 性别 -->
				<uni-list-item link :border="border" to="/subpkg/user_sex/user_sex">
					<template v-slot:body>
						<text class="text">性别</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{sex}}
						</view>
					</template>
				</uni-list-item>
				<!-- 民族 -->
				<uni-list-item link :border="border" to="/subpkg/user_nation/user_nation">
					<template v-slot:body>
						<text class="text">民族</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.nation ? userInfo.nation : "未知"}}
						</view>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
		<!-- 学校信息 -->
		<view class="list">
			<uni-list :border="border">
				<!-- 毕业学校 -->
				<uni-list-item link :border="border" to="/subpkg/user_schoolname/user_schoolname">
					<template v-slot:body>
						<text class="text">毕业学校</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.schoolname ? userInfo.schoolname : "未知"}}
						</view>
					</template>
				</uni-list-item>
				<!-- 毕业专业 -->
				<uni-list-item v-if="userInfo.major != '无'" link :border="border" to="/subpkg/user_major/user_major">
					<template v-slot:body>
						<text class="text">毕业专业</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text">
							{{userInfo.major ? userInfo.major : "未知"}}
						</view>
					</template>
				</uni-list-item>
				
				<!-- 意向院校 -->
				<uni-list-item v-if="userInfo.intendedschoolname != null && userInfo.intendedschoolname.length >0"  :border="border" >
					<template v-slot:body>
						<text class="text">意向院校</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text2">
							{{userInfo.intendedschoolname ? userInfo.intendedschoolname : "未知"}}
						</view>
					</template>
				</uni-list-item>
				<!-- 意向专业 -->
				<uni-list-item v-if="userInfo.intendedmajor != null && userInfo.intendedmajor.length >0"  :border="border" >
					<template v-slot:body>
						<text class="text">意向专业</text>
					</template>
					<template v-slot:footer>
						<view class="footer-text2">
							{{userInfo.intendedmajor ? userInfo.intendedmajor : "未知"}}
						</view>
					</template>
				</uni-list-item>
				
			</uni-list>
		</view>
	</view>
</template>

<script>
	import {mapState} from "vuex"
	export default {
		data() {
			return {
				border:false,
				portImageUrl:getApp().globalData.portImageUrl
			    
			};
		},

		computed:{
			...mapState("m_user",['userInfo']),
			//性别
			sex(){
				let sex = this.userInfo.sex
				if(sex !== null){
					let sex_ch = sex == 1 ? "男" : "女"
					return sex_ch
				}else{
					return "未知"
				}
			},
			//头像
			avatar(){
				if(this.userInfo.avatarurl.indexOf("/") == -1){
					return this.portImageUrl +"/avatar/"+ this.userInfo.avatarurl
				}else{
					return this.userInfo.avatarurl
				}
			}
		},
		methods:{
			
		}
	}
</script>

<style lang="scss">
	$title-font-size : 30rpx;
	$right-font-size : 25rpx;
	$right-font-color : #999;
	$height:40rpx;
	$line-height:40rpx;
	.text{
		height: $height;
		line-height:$height;
		font-size:$title-font-size;
	}
	.avater{
		width: 60rpx;
		height:60rpx;
		border-radius: 30rpx;
		right: 0;
		position:absolute;
		top: 14rpx;
	}

	.footer-text{
		height: $height;
		line-height: $height;
		position: absolute;
		right: 0;
		font-size: $right-font-size;
		color:$right-font-color;
	}
	.list{
		background-color:yellow;
		margin: 15rpx 0rpx;
		border-radius: 15rpx;
		overflow: hidden;
	}
	.avater-box{
		width: 60rpx;
		height:60rpx;
		border-radius: 30rpx;
		
	}
	.footer-text2{
		height: $height;
		line-height: $height;
		position: absolute;
		right: 30rpx;
		font-size: $right-font-size;
		color:$right-font-color;
	}
</style>
